<template>
	<!-- 资产领用 -->
	<view class="assetMain">
		<picker :range="pickerRange" @change="bindPickerChange">
			<view class="tab-posi">
				<NewSegmentedControl :current="currentTab" :values="items" style-type="text" active-color="#198a6c"
					@clickItem="onClickItem" />
			</view>
		</picker>

		<view class="assetList">
			<view class="assetListItem" v-for="(item, index) in assetsList" :key="index">
				<view class="itemHead">
					<view class="itemHeadTitle">
						<view>{{ item.applyUnitName ? item.applyUnitName : '--' }}</view>

					</view>
					<view class="itemHeadState"
						:class="item.status == 1 || item.status == 2 || item.status == 8 ? 'color-b-bg' : item.status == 5 ? 'color-g-bg' : item.status == 4 || item.status == 9 || item.status == 10 ? 'color-r-bg' : 'color-y-bg'">
						{{ item.statusCh ? item.statusCh : '未知' }}
					</view>
				</view>
				<view class="itemContent" @click="toDetail(item)">
					<view class="conCenter">
						<view>申请编号：{{ item.assetApplyNo }}</view>
						<view>申请人：{{ item.applicantName }}</view>
						<view>申请单位：{{ item.applyUnitName }}</view>
						<view>申请时间：{{ item.applyTime }}</view>
						<view style="color: #999;">备注信息：{{ item.remarks }}</view>
					</view>
					<view>
						<text class="iconfont" style="color: #999;">&#xe8d4;</text>
					</view>
				</view>
				<view class="itemHand"
					v-if="item.statusCh == '处理中' || item.statusCh == '待确认' || item.statusCh == '已作废' || item.statusCh == '待提交' || item.statusCh == '审核不通过'">
					<view v-if="item.statusCh == '待提交' || item.statusCh == '审核不通过'" @click="toExamine(item)"
						class="btn-s btn-green-s">提交审核</view>
					<view v-if="item.statusCh == '待提交'" @click="toAbandon(item)" class="btn-s btn-red-s">作废</view>
					<view v-if="item.statusCh == '已作废'" @click="toDel(item.assetApplyId)" class="btn-s btn-red-s">删除
					</view>
					<template v-if="item.statusCh == '待确认'" :class="{'permission-none':isPermission('ASS_IMP_CFM')}">
						<view class="btn-s btn-orange-s" @click="toSign(item)">签收</view>
					</template>

				</view>
			</view>
			<!-- 加载结束 -->
			<view class="uni-loadmore" v-if="showLoadMore">{{ loadMoreText }}</view>
		</view>

		<view :class="{ 'bottom-btn': true, 'permission-none': isPermission('ASS_APP_INSERT') }">
			<view class="buttons">
				<button class="toQR btn-green" @click="toApply"><text
						class="iconfont icon-xinzeng"></text>&nbsp;&nbsp;申请领用</button>
			</view>
		</view>
		<MessageTip ref="messageTip" :tipContent="tipContent" @clickType="handleShowOrHideTip" />

	</view>
</template>

<script lang="ts">
import {
	onPullDownRefresh,
	onReachBottom,
	onNavigationBarButtonTap,
	onBackPress,
	onShow
} from "@dcloudio/uni-app";
import {
	defineComponent,
	ref,
	reactive
} from 'vue'
import {
	applyList,
	assetSign,
	delApply,
	applyExamine,
	applyAbandon
} from '@/common/api/assetAPI.ts'
import {
	assetStatus,
	getPosition
} from '@/common/api/comAPI.ts'
import {
	applyPerson
} from "@/common/api/myApply";
import {
	CONSTANT
} from '@/common/config/config.ts'
import {
	fromSearch
} from '@/common/util/tabSearchUse.ts'
import searchPopup from '@/pages/searchPopup/index.vue'
import {
	isPermission
} from '@/common/util/common.ts'




export default defineComponent({
	components: {
		searchPopup,
	},
	setup(props, {
		emit
	}) {
		// const pages6 = getCurrentPages()
		// pages6.forEach(item=>{
		// 	console.log('------------222',item);
		// })
		const tipContent = ref('') //提示信息
		const messageTip = ref()
		const items = ref(["申请单位", "申请人", "状态"]);
		const pickerRange = ref();
		const currentTab = ref(0);

		const showLoadMore = ref(false);
		const loadMoreText = ref('加载中……'); //加载更多提示
		const assetsList = ref([]); //资产列表数据

		const assetStatusOpts = ref([]); // 状态数据
		const assetTypeOpts = ref([]); // 类型数据
		const statusPopup = ref(null); //状态弹出
		const applerOpts = ref([]); //申请人

		const toSearch = ref(null)
		// 搜索了列表
		function receive(e: any) {
			console.log(e)
			searchParams.value.assetName = e
			assetsList.value = []
			getList();
		}
		const toShow = ref(1)
		// 点击了搜索
		onNavigationBarButtonTap(() => {
			// 弹出搜索
			toShow.value++
		})
		onBackPress(() => {
			uni.switchTab({
				url: `/pages/index/index`
			})
			return true
		})
		const page = ref(CONSTANT.initPage); //初始加载页码
		const allPages = ref(0); //总页码数
		onPullDownRefresh(() => {
			console.log("触发下拉");
			// uni.startPullDownRefresh(); //下拉开启
			page.value = CONSTANT.initPage; //重置页码
			assetsList.value = []; //重置列表
			getList();
		});
		onReachBottom(() => {
			//触发底部
			if (page.value > allPages.value || page.value == allPages.value) {
				loadMoreText.value = '没有更多的数据了'
				showLoadMore.value = true;
			} else {
				page.value++;
				loadMoreText.value = '加载中……';
				showLoadMore.value = true;
				getList();
			}

		})
		//获取列表数据
		const searchParams = ref({
			status: null,
			assetApplyType: 1,
			applicant: null,
			applyUnits: null
		}); //查询条件
		const matchRule = {
			status: 'eq',
			assetApplyType: 'eq',
			applicant: 'eq',
			applyUnits: 'eq'
		}; //匹配条件
		onShow(() => {
			page.value = CONSTANT.initPage; //重置页码
			assetsList.value = []
			getList();
		})
		getEmuns();
		getType();

		//----------------------------------------
		const positionList = ref([]); // 位置数据
		const positionPopup = ref(null); //位置弹出
		// 获取位置
		function getPos() {
			getPosition().then(value => {
				if (value.code == 0) {
					positionList.value = value.data.records.map((item: any) => {
						return {
							label: item.storeName,
							value: item.id
						}
					})
				} else {
					uni.showToast({
						title: '位置获取失败',
						icon: "none"
					});
				}
			})
		}
		getPos()

		//----------------------------------------

		function getList() {
			let config = {
				page: page.value,
				rows: CONSTANT.pageSize,
				dtlRows: 3
			}
			const params = Object.assign(fromSearch(searchParams.value, matchRule), config)
			if (!isPermission('ASS_APP_LIST_QUERY')) {
				loadMoreText.value = '加载中...'
				applyList(params).then((res: any) => {
					uni.stopPullDownRefresh(); //关闭下拉
					if (res.code === 0) {
						allPages.value = res.data.pages;
						page.value = res.data.current;
						let list: any[] = res.data.records;
						list.forEach(en => {
							if (en.applyTime) {
								en.applyTime = en.applyTime.replace('T', " ");
							}
						})
						assetsList.value = assetsList.value.concat(list);
						if (assetsList.value.length === 0) {
							showLoadMore.value = true;
							loadMoreText.value = '暂无数据'
						} else if (assetsList.value.length < CONSTANT.pageSize) {
							showLoadMore.value = true;
							loadMoreText.value = '没有更多的数据了'
						} else {
							showLoadMore.value = false;
						}
					}

				})
			} else {
				showLoadMore.value = true;
				loadMoreText.value = '暂无数据'
			}

		}

		//获取资产状态
		function getEmuns() {
			assetStatusOpts.value = [];
			assetStatus('ApplyStatus').then((res: any) => {
				// console.log(res)
				if (res.code === 0) {
					assetStatusOpts.value = res.data.ApplyStatus.map((item: any) => {
						return {
							label: item.value,
							value: item.code
						}
					});
				}
			})
		}

		//获取资产类型
		function getType() {
			assetTypeOpts.value = [];
			assetStatus('AssetApplyType').then((res: any) => {
				// console.log(res)
				if (res.code === 0) {
					assetTypeOpts.value = res.data.AssetApplyType.map((item: any) => {
						return {
							label: item.value,
							value: item.code
						}
					});
				}
			})
			// 申请人
			applerOpts.value = [];
			applyPerson().then((res: any) => {
				if (res.code == 0) {
					applerOpts.value = res.data.records.map((item: any) => {
						return {
							label: item.nickName,
							value: item.id
						}
					})
				}
			})
		}

		function statusChange(i: Number) {
			searchParams.value.status = assetStatusOpts.value[i].code;
			statusPopup.value.close();
			tabItems.value[currentTab.value] = assetStatusOpts.value[i].value;
			//获取列表
			page.value = CONSTANT.initPage; //重置页码
			assetsList.value = []; //重置列表
			getList();
		}

		//tab点击事件
		const onClickItem = (e: {
			currentIndex: number
		}) => {
			page.value = CONSTANT.initPage;
			currentTab.value = e.currentIndex;
			switch (e.currentIndex) {
				case 0:
					pickerRange.value = positionList.value.map((item: {
						label: string,
						value: string
					}) => item.label);
					pickerRange.value.push('全部')
					break
				case 1:
					pickerRange.value = applerOpts.value.map((item: {
						label: string,
						value: string
					}) => item.label);
					pickerRange.value.push('全部')
					break
				case 2:
					pickerRange.value = assetStatusOpts.value.map((item: {
						label: string,
						value: string
					}) => item.label);
					pickerRange.value.push('全部')
					break
			}

		};
		const bindPickerChange = (e: any) => {
			let len = pickerRange.value.length - 1
			assetsList.value = [];
			if (currentTab.value == 0) {
				items.value[0] = e.detail.value == len ? '申请单位' : pickerRange.value[e.detail.value]
				searchParams.value.applyUnits = e.detail.value == len ? null : (positionList.value[e.detail.value] as EnumType).value
			} else if (currentTab.value == 1) {
				items.value[1] = e.detail.value == len ? '申请人' : pickerRange.value[e.detail.value]
				searchParams.value.applicant = e.detail.value == len ? null : (applerOpts.value[e.detail.value] as EnumType).value
			} else if (currentTab.value == 2) {
				items.value[2] = e.detail.value == len ? '状态' : pickerRange.value[e.detail.value]
				searchParams.value.status = e.detail.value == len ? null : (assetStatusOpts.value[e.detail.value] as EnumType).value
			}
			getList()
		};



		//识别资产
		function scan() {
			uni.scanCode({
				success: function (res) {
					console.log('条码类型：' + res.scanType);
					console.log('条码内容：' + res.result);
					//成功后跳转到资产详情
				}
			});
		}

		// 删除
		const delAssetApplyId = ref()
		const toDel = (assetApplyId) => {
			delAssetApplyId.value = assetApplyId
			tipContent.value = '确认删除吗？'
			messageTip.value.openTip()
		}
		const dialogConfirmDel = () => {
			delApply(delAssetApplyId.value).then(value => {
				if (value.code == 0) {
					uni.showToast({
						title: value.message,
						icon: 'none',
						duration: 500
					});
					setTimeout(() => {
						page.value = CONSTANT.initPage; //重置页码
						assetsList.value = []; //重置列表
						getList()
					}, 500)
				} else {
					uni.showToast({
						icon: 'none',
						title: value.message
					})
				}
			})
		}

		//提交审核
		const examineParams = ref({})
		const toExamine = (item) => {
			tipContent.value = '确认提交审核？'
			messageTip.value.openTip()
			examineParams.value = item
		}
		const dialogConfirmExamine = () => {
			applyExamine([{
				assetApplyId: examineParams.value.assetApplyId,
				version: examineParams.value.version
			}]).then(value => {
				if (value.code == 0) {
					uni.showToast({
						title: value.message,
						icon: "none",
						duration: 500
					});
					setTimeout(() => {
						page.value = CONSTANT.initPage; //重置页码
						assetsList.value = []; //重置列表
						getList()
					}, 500)
				} else {
					uni.showToast({
						title: value.message,
						icon: "none"
					});
				}
			})
		}

		// 作废
		const abandonParams = ref({})
		const toAbandon = (item) => {
			tipContent.value = '确认作废吗？'
			messageTip.value.openTip()
			abandonParams.value = item
		}
		const dialogConfirmAbandon = () => {
			applyAbandon([{
				assetApplyId: abandonParams.value.assetApplyId,
				version: abandonParams.value.version
			}]).then(value => {
				if (value.code == 0) {
					uni.showToast({
						title: value.message,
						icon: "none",
						duration: 500
					});
					setTimeout(() => {
						page.value = CONSTANT.initPage; //重置页码
						assetsList.value = []; //重置列表
						getList()
					}, 500)

				} else {
					uni.showToast({
						title: value.message,
						icon: "none"
					});
				}
			})
		}
		const handleShowOrHideTip = (type: string) => {
			if (type == 'yes') {
				if (tipContent.value == '确认作废吗？') {
					dialogConfirmAbandon()
				} else if (tipContent.value == '确认提交审核？') {
					console.log(111);
					dialogConfirmExamine()
				} else if (tipContent.value == '确认删除吗？') {
					dialogConfirmDel()
				}
			}
		}

		// 去申请领用资产
		const toApply = () => {
			uni.navigateTo({
				url: '/pages/assets/assetReceive/receiveApply',
			})
		}

		// 签收
		const toSign = (item) => {
			uni.navigateTo({
				url: '/pages/assets/assetApply/inList',
			})
		}

		// 实施列表
		const toPut = () => {
			uni.navigateTo({
				url: '/pages/assets/assetApply/putList',
			})
		}

		// 扫码签收 
		const qrSign = () => {
			uni.navigateTo({
				url: `/pages/qrCode/qrCode?tip=扫码失败？返回申请列表&successUrl=/pages/assets/assetApply/qrSign&clickTipUrl=/pages/assets/assetApply/index`,
			})
		}

		// 去资产申请详情
		const toDetail = (item) => {
			if (item.status === 1) {
				//待提交可以编辑
				uni.navigateTo({
					url: '/pages/assets/assetReceive/receiveApply?assetApplyId=' + item
						.assetApplyId,
				})
			} else {
				//其他状态为查看页面
				uni.navigateTo({
					url: '/pages/assets/assetReceive/applyDetList?assetApplyId=' + item
						.assetApplyId,
				})
			}

		}

		return {
			showLoadMore,
			loadMoreText,
			assetsList,

			searchParams,
			scan,
			currentTab,
			items,
			pickerRange,
			bindPickerChange,
			onClickItem,

			positionPopup,
			statusPopup,
			assetStatusOpts,
			assetTypeOpts,
			toDel,
			toApply,
			toSign,
			toPut,
			qrSign,
			toDetail,

			receive,
			toSearch,
			toShow,
			toExamine,
			toAbandon,
			positionList,
			isPermission,
			messageTip,
			tipContent,
			handleShowOrHideTip
		}
	},
})
</script>

<style lang="scss">
.conCenter>view:first-child {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.assetMain {
	background-color: #eee;
	font-size: 14px;
}

.assetNav {
	display: flex;
	flex-wrap: row nowrap;
	justify-content: space-around;
	padding: 15px;
	background-color: #fff;
}

.start-button {
	width: 60%;
	box-sizing: border-box;
	background-color: #198a6c;
	color: #fff;
	border-radius: 30px;
	line-height: 30px;
	font-size: 14px;
}

.assetList {
	padding: 30px 15px 80px 15px;
}

.itemHead {
	position: relative;
}

.assetListItem {
	margin-top: 15px;
	background-color: #fff;
	border-radius: 5px;
}

.itemHeadTitle {
	text-indent: 15px;
	box-sizing: border-box;
	padding-right: 80px;
	height: 40px;
	line-height: 40px;
	font-weight: bold;
	color: #333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	border-bottom: 1px solid #ddd;
}

.itemHeadState {
	position: absolute;
	right: 0;
	top: 8px;
	display: inline-block;
	font-size: 11px;
	color: #fff;
	padding: 2px 12px;
	border-radius: 15px 0 0 15px;
}

.itemContent {
	box-sizing: border-box;
	font-size: 15px;
	padding: 15px 10px;
	border-bottom: 1px solid #eee;
	display: flex;
	flex-wrap: row nowrap;
}

.itemContent>view:nth-child(1) {
	width: 85%;
	padding-left: 15px;
	color: #333;
}

.itemContent>view:nth-child(1)>view {
	padding: 3px 0;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
}

.itemContent>view:nth-child(2) {
	width: 15%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.itemHand {
	padding: 8px 10px;
	display: flex;
	justify-content: flex-end;
}

.itemHand>view {
	padding: 4px 23px;
	font-size: 13px;
	border-radius: 4px;
	margin-right: 14px;
}

// picker适配问题
</style>
